<template>
  <div class="trainReserve">
    <crumbs :BreadCrumb="BreadCrumb"></crumbs>
    <div class="top">
      <div class="left">
        <div>
          <div class="left_1">
            <div>{{ seats.from_station_name }}</div>
            <div>-</div>
            <div>{{ seats.to_station_name }}</div>
            <div style="margin: 0 0 0 50px">
              <el-button @click="dialogVisible = true" size="mini">请选择席位</el-button>
            </div>
            <div style="margin: 0 0 0 10px">
              <div v-show="0 === number">商务座</div>
              <div v-show="1 === number">一等座</div>
              <div v-show="2 === number">二等座</div>
              <div v-show="3 === number">硬座</div>
              <div v-show="4 === number">硬卧</div>
              <div v-show="5 === number">软卧</div>
              <div v-show="6 === number">
                <p>高级软卧</p>
              </div>
              <div v-show="7 === number">
                <p>无座</p>
              </div>
              <div v-show="8 === number">
                <p>特等座</p>
              </div>
              <div v-show="9 === number">
                <p>软座</p>
              </div>
              <div v-show="10 === number">
                <p>动卧</p>
              </div>
            </div>
            <!-- 席位列表 -->
            <el-dialog close="button_1" :visible.sync="dialogVisible" :close-on-click-modal="false" width="30%">
              <el-button v-if="seats.swz_price != 0" style="margin: 0 0 5px 0" @click="change(0)">商务座:&nbsp;
                <span>￥{{ seats.swz_price == 0 ? "无" : seats.swz_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.swz_num == "--" ? "无" : seats.swz_num
                }}</span> </el-button><br />

              <el-button v-if="seats.ydz_price != 0" style="margin: 0 0 5px 0" @click="change(1)">一等座:&nbsp;
                <span>￥{{ seats.ydz_price == 0 ? "无" : seats.ydz_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.ydz_num == "--" ? "无" : seats.ydz_num
                }}</span> </el-button><br />
              <el-button v-if="seats.edz_price != 0" style="margin: 0 0 5px 0" @click="change(2)">二等座:&nbsp;
                <span>￥{{ seats.edz_price == 0 ? "无" : seats.edz_price }}</span>
                &nbsp; &nbsp;余:
                <span style="color: red">{{
                  seats.edz_num == "--" ? "无" : seats.edz_num
                }}</span> </el-button><br />
              <el-button v-if="seats.yz_price != 0" style="margin: 0 0 5px 0" @click="change(3)">硬座:&nbsp;
                <span>￥{{ seats.yz_price == 0 ? "无" : seats.yz_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.yz_num == "--" ? "无" : seats.yz_num
                }}</span> </el-button><br />
              <el-button v-if="seats.yw_price != 0" style="margin: 0 0 5px 0" @click="change(4)">硬卧:&nbsp;
                <span>￥{{ seats.yw_price == 0 ? "无" : seats.yw_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.yw_num == "--" ? "无" : seats.yw_num
                }}</span> </el-button><br />
              <el-button v-if="seats.rw_price != 0" style="margin: 0 0 5px 0" @click="change(5)">软卧:&nbsp;
                <span>￥{{ seats.rw_price == 0 ? "无" : seats.rw_price }}</span>
                &nbsp; &nbsp;余:
                <span style="color: red">{{
                  seats.rw_num == "--" ? "无" : seats.rw_num
                }}</span> </el-button><br />
              <el-button v-if="seats.gjrw_price != 0" style="margin: 0 0 5px 0" @click="change(6)">高级软卧:&nbsp;
                <span>￥{{ seats.gjrw_price == 0 ? "无" : seats.gjrw_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.gjrw_num == "--" ? "无" : seats.gjrw_num
                }}</span> </el-button><br />
              <el-button v-if="seats.wz_price != 0" style="margin: 0 0 5px 0" @click="change(7)">无座:&nbsp;
                <span>￥{{ seats.wz_price == 0 ? "无" : seats.wz_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.wz_num == "--" ? "无" : seats.wz_num
                }}</span> </el-button><br />
              <el-button v-if="seats.tdz_price != 0" style="margin: 0 0 5px 0" @click="change(8)">特等座:&nbsp;
                <span>￥{{ seats.tdz_price == 0 ? "无" : seats.tdz_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.tdz_num == "--" ? "无" : seats.tdz_num
                }}</span>
              </el-button>
              <el-button v-if="seats.rz_price != 0" style="margin: 0 0 5px 0" @click="change(8)">软座:&nbsp;
                <span>￥{{ seats.rz_price == 0 ? "无" : seats.rz_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.rz_num == "--" ? "无" : seats.rz_num
                }}</span>
              </el-button>
              <el-button v-if="seats.dwx_price != 0" style="margin: 0 0 5px 0" @click="change(8)">动卧:&nbsp;
                <span>￥{{ seats.dwx_price == 0 ? "无" : seats.dwx_price }}</span>
                &nbsp;&nbsp;余:
                <span style="color: red">{{
                  seats.dw_num == "--" ? "无" : seats.dw_num
                }}</span>
              </el-button>
              <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
              </span>
            </el-dialog>
            <!-- <el-form ref="form" :model="value" label-width="80px">
              <el-select v-model="value" placeholder="请选择" size="mini">
                <el-option
                style="width:12px;"
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form> -->
          </div>
          <div style="margin: 10px 0 10px 0">
            <div style="display: flex">
              <div style="margin: 0 50px 0 0">{{ seats.train_code }}</div>
              <div>出发:</div>
              <div style="margin: 0 50px 0 0">
                {{ seats.from_station_name }}
                <span style="color:#00CC00;">{{seats.fromStationSite=='originate' ?'始发' :seats.fromStationSite=='passingBy' ?'路过' :"终点"}}</span>
              </div>
              <div style="margin: 0 50px 0 0">
                出发时间：{{ seats.strTime }}日{{ seats.start_time }}
              </div>
              <div>耗时：</div>
              <div style="margin: 3px 0 0 0">{{ seats.run_time }}</div>
            </div>
            <div style="display: flex; margin: 10px 0 0 0">
              <!-- <div style="margin: 0 50px 0 0;">{{seats.train_code}}</div> -->
              <!-- <div style="margin: 0 50px 0 0;">高铁</div> -->
              <div style="margin: 0 0 0 10%">到达:</div>
              <div style="margin: 0 50px 0 0">
                {{ seats.to_station_name }}
                <!-- 经停信息 -->
                <span style="color:#00CC00;"> {{seats.toStationSite=='originate' ?'始发':seats.toStationSite=='passingBy' ?'路过' :"终点"}}</span>
              </div>
              <div>到达时间：{{ seats.strTime }}日{{ seats.arrive_time }}</div>
            </div>
          </div>
        </div>
        <div class="left_1" style="margin: 20px 0 10px 0" v-if="type != 'change'">
          会员查询(通过手机号查询)
        </div>
        <el-form v-if="type != 'change'" :model="members" size="mini" style="display: flex">
          <el-form-item label="手机号" style="display: flex;">
            <el-input v-model="members.phone"></el-input>
          </el-form-item>
          <el-form-item label="姓名" style="display: flex; margin: 0 32px">
            <el-input :disabled="true" style="width: 100px" v-model="membersList.userName"></el-input>
          </el-form-item>
          <el-button v-if="type != 'change'" size="mini" type="primary"
            style="margin: 0 0 0 20px; width: 60px; height: 30px" @click="thequeryCustomer">查询</el-button>
        </el-form>
        <el-descriptions class="margin-top" v-if="membersList.userName && membersList.userCardBO" :column="3" border>
          <el-descriptions-item>
            <template slot="label">
              会员卡名
            </template>
            {{membersList.userCardBO.cardName}}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              会员卡号
            </template>
            {{membersList.userCardBO.cardNumber}}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              证件号
            </template>
            {{membersList.userCardBO.cardHolderIdNumber}}
          </el-descriptions-item>
        </el-descriptions>
        <div v-if="type != 'change'" class="left_1" style="margin: 20px 0 10px 0">联系人信息</div>
        <el-form v-if="type != 'change'" :model="members" size="mini" style="display: flex">
          <el-form-item label="姓名" style="display: flex;">
            <el-input v-model="contactUser.contactName"></el-input>
          </el-form-item>
          <el-form-item label="手机号" style="display: flex; margin: 0 32px">
            <el-input v-model="contactUser.contactPhone"></el-input>
          </el-form-item>
        </el-form>
        <div class="left_1" style="margin: 20px 0 10px 0">乘客信息</div>
        <div style="display: flex; margin: 20px 0 20px 0" v-for="(item, index) in passenger" :key="index">
          <div style="margin: 0 30px 0 0">
            <span>姓名：</span>
            <span>{{ item.passName }}</span>
          </div>
          <div style="margin: 0 30px 0 0">
            <span>身份证号：</span>
            <span>{{ item.certificateNumber }}</span>
          </div>
          <div style="margin: 0 30px 0 0" v-if="item.passPhone">
            <span>手机号：</span>
            <span>{{ item.passPhone }}</span>
          </div>
          <div style="margin: 0 30px 0 0" v-if="item.passType">
            <!-- <span>手机号：</span> -->
            <span>{{ item.passType == "adult" ? "成人" : item.isFreeChildren =="yes"?"免费儿童": "儿童" }}</span>
          </div>
          <div style="margin: 0 30px 0 0" v-if="type != 'change'">
            <el-button size="mini" type="warning" @click="delpassenger(index)">删除</el-button>
          </div>
        </div>
        <div v-if="type != 'change'">
          <el-button style="background-color: #ff9700; color: #fff" @click="Addriders">添加乘车人</el-button>
        </div>
        <div style="margin-top:12px">购票提示:</div>
        <div style="font-size: 12px">
          1、预定1.2米以下儿童车票证件信息需使用同车次成人证件。<br />
          2、每张票20订票费，退票不返还。暂时不提供学生票、军人票、团体票预订服务;<br />
          3、儿童票<span class="childexplain"
            @click="childexplainmethod()">儿童购票说明</span>,卧铺价格不定，支付价格可能高于最终价格。如有差价,将在出票后1-15个工作日内退至原支付账户。<br />
          4、收到票款后实时为您出票，若出票失败会短信通知您并立即退款至原支付账户（1-15个工作日到账）。
        </div>
        <!-- <div class="left_1" style="margin: 10px 0 10px 0">附加产品信息</div> -->
        <!-- <div
          v-model="auxiliary.ischeck"
          :label="item.id"
          v-for="(item, index) in auxiliary"
          :key="index"
        >
          <el-checkbox @change="selectaccident(item, index)">{{
            item.name
          }}</el-checkbox>
          v-model="auxiliary.ischeck=true" 
        </div> -->
        <div v-if="this.membersList.customerId">
          <el-table ref="multipleTable" :data="selectReturnData" tooltip-effect="dark" style="width: 100%"
            @selection-change="handleSelectionChangefuying">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column prop="name" label="名称" width="140">
              <template slot-scope="scope">
                  <el-tooltip content="Bottom center" placement="bottom" effect="light">
                    <div slot="content">
                      <div>简介：{{scope.row.describe}}</div>
                      <div>
                        详细说明：{{scope.row.explain}}
                      </div>

                      <div>强制提醒：{{scope.row.remaid}}</div>
                    </div>
                    <!-- <el-button>Top center</el-button> -->
                    <div>{{scope.row.name}}</div>
                  </el-tooltip>
                </template>
            </el-table-column>
            <el-table-column label="价格" width="120">
              <template slot-scope="scope">
                <template>{{scope.row.salePrice}}</template>
                <!-- <template v-if="!IscardId">{{scope.row.memberPrice}}</template> -->
              </template>
            </el-table-column>

          </el-table>
        </div>
        <el-button v-if="type != 'change'" style="
            margin: 20px 0 10px 50%;
            background-color: #ff9700;
            color: #fff;
          " @click="create">创建订单</el-button>
        <el-button v-if="type == 'change'" style="
            margin: 20px 0 10px 50%;
            background-color: #ff9700;
            color: #fff;
          " @click="create">确认改签</el-button>
      </div>
      <!-- 右边 -->
      <div class="right">
        <div class="right_1">
          <div style="margin: 0 0 20px 0">票价信息</div>
          <div class="right_3">
            <div>票价总数</div>
            <div style="display: flex">
              <div>
                {{ unitprice }}
              </div>
              <div>*{{ passenger.length - feelChirenLength}}</div>
            </div>
          </div>
          <div class="right_3" v-for="(item,index) in fujiapanpinList" :key="index">
            <div> {{ item.name }}</div>
            <div style="display: flex">
              <div>
                {{item.salePrice}}
                <!-- {{IscardId?item.underlinePrice:item.memberPrice}} -->
              </div>
              <div>*{{ passenger.length - feelChirenLength}}</div>
            </div>
          </div>
           <div class="right_3" v-if="type!='change'">
            <div>订票费用</div>
            <div>
              ￥5*
              <span>{{ passenger.length - feelChirenLength}}</span>
            </div>
          </div>
          <div class="right_3" v-if="type=='change'">
            <div>原票价</div>
            <div>
              <span>{{ formerPrice }}</span>
              <span>*{{ passenger.length}}</span>
            </div>
          </div>
          <div class="right_3" v-if="type=='change'">
            <div>改签差价</div>
            <div>
              <span>{{ (unitprice-formerPrice) * passenger.length}}</span>
            </div>
          </div>
          <div class="right_3" v-if="type=='change' && unitprice>formerPrice">
            <div>需补费用</div>
            <div>
              <span style="color: #ff9700">￥{{ unitprice-formerPrice }}</span>
              <span >*{{ passenger.length }}</span>
            </div>
          </div>
          <div class="right_4"  v-if="type!='change'">
            <div>订单总额</div>
            <div style="color: #ff9700">￥{{ totalprice }}</div>
          </div>
        </div>
        <div class="right_5">
          <div>温馨提示</div>
          <hr style="margin: 10px 0 10px 0" />
          <div style="font-size: 12px">
            1.成人退票时，如名下有儿童票需一同退票
            <br /><br />
            2.由于各铁路局相关政策，火车票源紧张等原因，没办法保证100%出票成功，
            请以收到短信为准。如果出票失败，所有票款会在3-7个工作日退回到您支付账户中
            ，请放心支付。<br /><br />
            3.自3月1日起，铁路对互联网购票实行实名信息验证，请您填写真实有效证件信息。
            如因证件信息未通过验证造成购票失败，敬请谅解。<br /><br />
            4.只支持二代身份证，儿童票先按成人票款，出票成功再返回。<br /><br />
          </div>
        </div>
      </div>
    </div>
    <!-- 新增弹窗 -->
    <div class="Membership card">
      <el-dialog height="600px" title="添加乘车人" :visible.sync="centerDialogVisible" :close-on-click-modal="false"
        width="70%">
        <el-button class="addBtn" @click="innerVisibleADD">添加乘客</el-button>
        <!-- 新增联系人 -->
        <el-dialog width="40%" title="新增乘客" :visible.sync="innerVisible" :close-on-click-modal="false" append-to-body>
          <el-form :rules="rules" :label-position="labelPosition" label-width="80px" :model="formLabelAlign"
            ref="formLabelAlign">
            <el-form-item label="乘客类型">
              <el-radio-group class="radios" style="margin-bottom:0" v-model="reverse1" @change="changeradio">
                <el-radio :label="0">成人</el-radio>
                <el-radio :label="1">儿童</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="姓名" prop="name">
              <el-input v-model="formLabelAlign.name" placeholder="与乘客证件姓名一致"></el-input>
            </el-form-item>
            <el-form-item label="性别">
              <el-radio-group class="radios" style="margin-bottom:0" v-model="formLabelAlign.sex">
                <el-radio :label="0">男</el-radio>
                <el-radio :label="1">女</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="生日">
              <el-date-picker
                v-model="formLabelAlign.birthday"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
                style="width:100%"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="手机号" prop="phone">
              <el-input v-model="formLabelAlign.phone" placeholder="请输入十一位手机号"></el-input>
            </el-form-item>
            <el-form-item label="证件类型" prop="value">
              <el-select v-model="value" placeholder="请选择" clearable>
                <el-option v-for="item in cities1" :key="item.value" :label="item.label" :value="item.value">
                  <span style="float: left">{{ item.label }}</span>
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="证件号" prop="idNumber">
              <el-input v-model="formLabelAlign.idNumber" placeholder="与乘客证件号码一致"></el-input>
            </el-form-item>
            <el-form-item label="国家" v-if="value && value != 'ZGJMSFZ'" >
              <foreign-area :popularCity=" { value:'CN',label:'中国'}"  @selectcountry="selectFnCountry($event,'formLabelAlign','country')"></foreign-area>
            </el-form-item>
            <el-form-item label="证件有效期"
              v-if="value && value != 'ZGJMSFZ'"
              label-width="120px"
            >
              <el-date-picker
                style="width:100%"
                v-model="formLabelAlign.gatValidDateEnd"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
              >
              </el-date-picker>
            </el-form-item>
            <el-button class="btnRefer" @click="addsubmitForm('formLabelAlign')">提交</el-button>
            <el-button class="cancelbtnRefer" style="margin-left:0px" @click="innerVisible=false">取消</el-button>
          </el-form>
        </el-dialog>
        <el-table ref="passengerList" 
          :data="passengerList" 
          tooltip-effect="dark"
          @selection-change="handleSelectionChange"
          selectable = "passengerListAble" 
          size="mini" border>
          <el-table-column type="selection" width="50"> </el-table-column>
          <el-table-column prop="passName" label="姓名" width="100">
          </el-table-column>
          <el-table-column prop="passType" label="车票类型" width="76">
            <template slot-scope="scope">
              <template v-if="scope.row.passType == 'adult'">成人</template>
              <template v-if="scope.row.passType == 'children'">儿童</template>
            </template>
          </el-table-column>
          <el-table-column prop="phoneVerifyStatus" label="手机核验" width="76">
            <template slot-scope="scope">
              <template v-if="scope.row.phoneVerifyStatus == '1'">通过</template>
              <template v-else>未通过</template>
            </template>
          </el-table-column>
          <el-table-column prop="verifyStatus" label="身份核验" width="76">
            <template slot-scope="scope">
              <template v-if="scope.row.verifyStatus == '0'">未通过</template>
              <template v-if="scope.row.verifyStatus == '1'">通过</template>
              <template v-if="scope.row.verifyStatus == '2'">未知</template>
              <template v-if="scope.row.verifyStatus == '3'">待核验</template>
              <template v-if="scope.row.verifyStatus == '4'">请报验</template>
              <template v-if="scope.row.verifyStatus == '5'">预通过</template>
            </template>
          </el-table-column>
          <el-table-column prop="certificateType" label="证件类型" width="160">
            <template slot-scope="scope">
              <template v-if="scope.row.certificateType == 'ZGJMSFZ'">中国居民身份证</template>
              <template v-if="scope.row.certificateType == 'GATJMJZZ'">港澳台居民居住证</template>
              <template v-if="scope.row.certificateType == 'GAJMLWNDTXZ'">港澳居民来往内地通行证</template>
              <template v-if="scope.row.certificateType == 'TWJMLWDLTXZ'">台湾居民来往大陆通行证</template>
              <template v-if="scope.row.certificateType == 'HZ'">护照</template>
              <template v-if="scope.row.certificateType == 'WGRYJJLSFZ'">外国人永久居留身份证</template>
            </template>
          </el-table-column>
          <el-table-column prop="certificateNumber" label="身份证">
          </el-table-column>
          <el-table-column prop="date" label="操作" width="200">
            <template slot-scope="scope">
              <el-button size="mini" v-if="scope.row.phoneVerifyStatus == '0'" @click="editPhoneVerifyStatus(scope.row)">刷新核验状态</el-button>
              <!-- <el-button size="mini" @click="btnModify(scope.row)">修改</el-button> -->
              <el-button size="mini" @click="btnDelate(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- 编辑 -->
        <el-dialog width="40%" title="修改乘客" :visible.sync="innerVisibleaEdit" :close-on-click-modal="false"
          append-to-body>
          <el-form :rules="editrules" :label-position="labelPosition" label-width="80px" :model="editPassengersList">
            <el-radio-group class="radios" v-model="editPassengersList.reverse">
              <el-radio :label="0">成人</el-radio>
              <el-radio :label="1">儿童</el-radio>
            </el-radio-group>
            <el-form-item label="姓名" prop="namerules1">
              <el-input v-model="editPassengersList.name" placeholder="与乘客证件姓名一致"></el-input>
            </el-form-item>
            <el-form-item label="生日">
              <el-date-picker
                v-model="editPassengersList.birthday"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
                style="width:100%"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="手机号" prop="phonerules1">
              <el-input v-model="editPassengersList.phone" placeholder="请输入十一位手机号"></el-input>
            </el-form-item>
            <el-form-item label="证件类型" prop="region">
              <el-select v-model="editPassengersList.type" @change="editPassengersListType" placeholder="请选择" clearable>
                <el-option v-for="item in cities1" :key="item.value" :label="item.label" :value="item.value">
                  <span style="float: left">{{ item.label }}</span>
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="证件号" prop="idNumber">
              <el-input v-model="editPassengersList.idNumber" placeholder="与乘客证件号码一致"></el-input>
            </el-form-item>
            
            <el-form-item label="国家" v-if="editPassengersList.type && editPassengersList.type != 'ZGJMSFZ'" >
              <foreign-area :popularCity=" { value:'CN',label:'中国'}"  @selectcountry="selectFnCountry($event,'editPassengersList','country')"></foreign-area>
            </el-form-item>
            <el-form-item label="证件有效期"
              v-if="editPassengersList.type && editPassengersList.type != 'ZGJMSFZ'"
              label-width="120px"
            >
              <el-date-picker
                style="width:100%"
                v-model="editPassengersList.gatValidDateEnd"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
              >
              </el-date-picker>
            </el-form-item>
            <el-button @click="editaddUpdatePassenger()" class="btnRefer">提交</el-button>
            <el-button @click="innerVisibleaEdit = false" style="width:100%;margin:20px 0 0 0;">取消</el-button>
          </el-form>
        </el-dialog>
        <el-button class="confirmAdd" @click="confirm">确认添加</el-button>
        <el-button type="primary" @click="centerDialogVisible = false">取消</el-button>
      </el-dialog>
    </div>
    <!-- 验证码 -->
    <el-dialog title="验证码" :visible.sync="verification" :close-on-click-modal="false" width="40%">
      <div class="input1">
        <p>验证码：</p>
        <el-input class="input" v-model="randCode" placeholder="请输入验证码"></el-input>
      </div>
      <el-button style="margin: 0 0 0 35%" type="" @click="jump">确定</el-button>
      <el-button type="" @click="verification = false">取消</el-button>
    </el-dialog>
    <!-- 登录 -->
    <div class="Membership card">
      <el-dialog title="登录12306" :visible.sync="centerDialog" :close-on-click-modal="false" width="40%">
        <div>
          <div class="input1">
            <p>账户 ：</p>
            <el-input class="input" v-model="trainAccount" placeholder="请输入账户"></el-input>
          </div>
          <div class="input1">
            <p>密码 ：</p>
            <el-input class="input" v-model="pass" type="password" placeholder="请输入密码"></el-input>
          </div>
        </div>
        <div class="read">
          <el-checkbox v-model="checked" @change="checkedList">同意阅读</el-checkbox>
          <!-- <el-radio v-model="radio" label="1" @click="radio == 1">同意阅读</el-radio> -->
          <span @click="Train12306AccountAgreement">《火车票12306购票服务协议》</span>
          <!-- <a href="">忘记账户名/密码</a> -->
        </div>

        <div class="btn-div">
          <el-button type="primary" @click="getrelationV">登录12306</el-button>
          <!-- 没有12306 -->
          <!-- <el-button class="a-register" type="primary" @click="innerVisible1zhuce">点击注册</el-button> -->
          <el-button type="primary" @click="centerDialog = false">取消</el-button>
        </div>
        <el-dialog width="50%" title="注册12306" :visible.sync="innerVisible1" append-to-body
          :close-on-click-modal="false">
          <el-form :label-position="labelPosition" label-width="80px" :model="zhuceList">
            <!-- <el-radio-group class="radios" v-model="reverse">
            <el-radio :label="true">成人</el-radio>
            <el-radio :label="false">儿童</el-radio>
          </el-radio-group> -->

            <el-form-item label="用户名">
              <el-input v-model="zhuceList.userName" placeholder="与乘客证件姓名一致"></el-input>
            </el-form-item>
            <el-form-item label="密码">
              <el-input v-model="zhuceList.passWord" placeholder="不少于六位" type="password"></el-input>
            </el-form-item>
            <!-- <el-form-item label="再输入密码">
              <el-input v-model="zhuceList.passwordAgion" placeholder="再次输入密码" type="password"></el-input>
            </el-form-item> -->
            <el-form-item label="姓名">
              <el-input v-model="zhuceList.name" placeholder="请填写真实姓名"></el-input>
            </el-form-item>
            <el-form-item label="证件类型" prop="region">
              <el-select v-model="zhuceList.idTypeCode" placeholder="请选择" clearable>
                <el-option v-for="item in cities1" :key="item.value" :label="item.label" :value="item.value">
                  <span style="float: left">{{ item.label }}</span>
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="证件号">
              <el-input v-model="zhuceList.idNo" placeholder="请输入证件号"></el-input>
            </el-form-item>
            <el-form-item label="手机号">
              <el-input v-model="zhuceList.mobileNo" placeholder="请输入十一位手机号"></el-input>
            </el-form-item>
            <el-form-item label="乘客类型" prop="region">
              <el-select v-model="zhuceList.passengerType" placeholder="请选择" clearable>
                <el-option v-for="item in chengkecities" :key="item.value2" :label="item.label" :value="item.value2">
                  <!-- <span style="float: left">{{ item.label }}</span> -->
                </el-option>
              </el-select>
            </el-form-item>
            <el-button class="btnRefer" @click="getregisterAccount">一键注册</el-button>
            <!-- <el-button :plain="true" @click="open4"></el-button> -->
          </el-form>
        </el-dialog>
        <!-- 儿童说明弹出框 -->
      </el-dialog>
      <el-dialog title="儿童购票说明" :visible.sync="childdialogVisible" width="30%">
        <div>1.儿童不能单独乘车。为确保儿童出行安全，儿童需有成人同行。<br>
          2.身高在1.2米~1.5米的儿童需购买儿童票。身高超过1.5米的，需购买成人票。<br>
          3. 每位成年旅客可以免费携带一名身高1.2米以下儿童；超过一名时，其他儿童需购买儿童票。<br>
          4.由于儿童票价格不定，先按照成人票价收取费用，之后会根据实际出票价格退还差价。<br>
          5.卧铺儿童票与同行成人各有床位，需要而与儿童共用床位的，请至车站买票。<br>
          6.儿童使用同行成人的证件购票，取票时请使用成人证件在自助取票机或取票窗口取票。<br>
          7.请根据儿童实际身高购票，如进站时因身高超过标准而无法进站，金色世纪不承担任何责任。<br>
        </div>
      </el-dialog>
    </div>
    <el-dialog :close-on-click-modal="false" :visible.sync="AccountAgreement" width="45%" center>
          <div>
            《火车票12306购票服务协议》（以下简称“本协议”）是北京金色世纪商旅网络科技股份有限公司（以下简称 “我公司”）与平台用户(包括使用我公司APP进行代订票服务的所有出行人，以下简称“您”)就12306账号注册及授权托管、修改、使用等相关事宜所订立的合约。请您务必在使用我公司的产品或接受我公司的火车票代订服务前仔细阅读本协议，特别是加粗字体显示的内容。如您不同意本协议的任何内容，或者无法准确理解协议条款的含义，请您不要进行下一步操作并拒绝使用我公司的产品或服务。否则，即表示您已理解并接受本协议的全部条款以及与本协议有关的各项规则、说明、页面展示、操作流程、公告或通知（以下统称“规则”）。
            第一条 服务说明
            我公司在得到您授权后，将通过12306官方网站执行注册、登录、修改账号信息等相关操作。
            1.1您可在12306官网上自行登陆您的12306账号进行查询、订票、退票、改签、候补等操作，也可选择将您的12306账号和密码授权给我公司代您进行上述操作，如您未注册12306账号，但需要继续使用我公司服务的，您需要授权我公司代您申请注册12306账号。
            1.2您将允许我公司使用您的12306账户中您选择的常用联系人信息进行火车票查询、订票、退票、改签、候补等操作，包括但不限于授权我公司使用您选择的常用联系人信息进行上述操作。
            第二条 权利及义务
            我公司承诺严格执行《中华人民共和国个人信息保护法》的规定，切实履行个人信息保护义务，仅就提供服务之目的处理您的个人信息。请您在接受服务前审慎核实您提供的个人信息，若您选择进行下一步操作，则表示您同意我公司基于为您提供服务之目的依法收集、存储、使用您提供的个人信息。我公司需要您提供并收集、存储、使用您个人信息的具体场景和内容如下：
            2.1我公司提供的是火车票代订服务，如您接受本协议，意味着您同意我们使用您填写的所有乘客信息进行火车票代订操作，同时您必须遵守12306购票规定的服务条款。
            (服务条款所在网址https://kyfw.12306.cn/otn/regist/rule）
            2.2为了更好地给您提供火车票代订服务，我公司将根据本协议使用您的12306账号及密码操作火车票代订事宜,也会在系统中记录您的前述信息，同时对于您的个人信息（包括但不限于您的姓名、身份证号、手机号、登录账号、登陆密码、个人邮箱等）及相关交易信息（包括但不限于购票信息、支付信息、银行卡号等），金色世纪会严格按照《中华人民共和国个人信息保护法》的规定进行保护。
            2.3如发生账号及密码信息变更,请您及时完成更新,我公司不对因此带来的查询、订票、退票、改签、候补等操作失败承担任何责任。
            2.4我公司可根据国家法律法规变化及维护交易秩序、保护消费者权益需要，不定期对本协议进行调整和完善。
            2.5本协议下的技术服务会向您收取技术服务费。
          </div>
          <el-button type="primary" @click="AccountAgreement=false">取消</el-button>
        </el-dialog>
    <!-- 新增乘客验证码 -->
    <el-dialog title="验证码" :visible.sync="xinzengyanzhegnma" :close-on-click-modal="false" width="40%">
      <div class="input1">
        <p>验证码：</p>
        <el-input class="input" v-model="yanzhegnma" placeholder="请输入验证码"></el-input>
      </div>
      <el-button style="margin: 0 0 0 35%" type="" @click="jumpaaa">确定</el-button>
      <el-button type="" @click="xinzengyanzhegnma = false">取消</el-button>
    </el-dialog>
  </div>
</template>

<script>
  import crumbs from "../../components/Crumbs.vue";
  import foreignArea from "@/components/sw-area/foreignArea.vue"
  export default {
    name: 'generate',
    components: {
      crumbs,
      foreignArea
    },
    data() {
      return {
        contactUser:{
          contactName:"",
          contactPhone:""
        },
        AccountAgreement: false,
        yanzhegnma: "",
        xinzengyanzhegnma: false,
        IscardId: false,
        underlinePricearr: 0,
        // 选中的附加产盘
        fujiapanpinList: [],
        selectReturnData: [],
        zhuceList: {
          userName: "",
          passWord: "",
          idTypeCode: "",
          name: "",
          idNo: "",
          passengerType: null,
          mobileNo: "",
        },
        BreadCrumb: [{
            path: "/train/trainReserve",
            name: "火车票预定"
          },
          {
            path: "/train/generate",
            name: "火车票创建订单"
          },
        ],
        // 新增验证
        rules: {
          name: [{
            required: true,
            message: "请输入姓名",
            trigger: "blur"
          }, ],
          phone: [{
            required: true,
            message: "手机号",
            trigger: "blur"
          }, ],
          idNumber: [{
            required: true,
            message: "请输入证件号",
            trigger: "blur"
          }, ],
        },
        // 新增验证
        editrules: {
          namerules1: [{
            required: true,
            message: "请输入姓名",
            trigger: "blur"
          }, ],
          phonerules2: [{
            required: true,
            message: "手机号",
            trigger: "blur"
          }, ],
          idNumber: [{
            required: true,
            message: "请输入证件号",
            trigger: "blur"
          }, ],

        },
        // 查询待修改的乘车人id
        commonTrvelersId: "",
        checked: false,
        go: "",
        reverse1: 0,
        reverseList: '0',
        type: this.$route.params.type ? this.$route.params.type : "",
        codeList: {},
        isFeelTrain:true, //列车是否有免费儿童票
        feelChirenLength:0,
        unitprice: 0,
        randCode: "",
        // 会员
        membersList: {},
        members: {
          phone: "",
          idCode: ""
        },
        resData: {},
        verification: false,
        dataList: [],
        // type:"",
        // 嵌套内容
        formLabelAlign: {
          userName: "",
          password: "",
          passwordAgion: "",
          name: "",
          idNumber: "",
          phone: "",
          sex:"",
          birthday:"",
          gatValidDateEnd:"",
          country:"CN"
        },
        cities1: [{
            value: "ZGJMSFZ",
            label: "中国居民身份证",
          },
          {
            value: "GATJMJZZ",
            label: "港澳台居民居住证",
          },
          {
            value: "GAJMLWNDTXZ",
            label: "港澳居民来往内地通行证",
          },
          {
            value: "TWJMLWDLTXZ",
            label: "台湾居民来往大陆通行证",
          },
          {
            value: "HZ",
            label: "护照",
          },
          {
            value: "WGRYJJLSFZ",
            label: "外国人永久居留身份证",
          },
        ],
        value: "",
        // 乘客类型
        chengkecities: [{
            value2: 1,
            label: "成人票",
          },
          {
            value2: 2,
            label: "儿童票",
          },
          {
            value2: 3,
            label: "学生票",
          },
          {
            value2: 4,
            label: "残疾军人、伤残人民警察",
          },
        ],
        value2: "",
        labelPosition: 'right',
        innerVisible: false,
        innerVisible1: false,
        radio: "0",
        trainAccount: "", //账户
        pass: "", //密码
        centerDialog: false,
        // 登录返回数据
        loginList: {},
        isPass: '',
        train: [],
        totalprice: 0,
        information: {},
        passenger: this.$route.params.passenger ? this.$route.params.passenger : [],
        price: {},
        // 带来火车信息
        train: {},
        numberList: [],
        numberLists: "",
        // 当前乘车人列表
        passengerList: [],
        number: '',
        dialogVisible: false,
        valueL: "",
        seats: [],
        auxiliary: [],
        // 原票价
        formerPrice:0,
        //证件类型 
        cities: [{
            value: "ID_CARD",
            label: "身份证",
          },
          {
            value: "MILITARY_ID",
            label: "军人证",
          },
          {
            value: "PASSPORT",
            label: "护照",
          },
          {
            value: "MTPFHKAMR",
            label: "港澳居民来往内地通行证",
          },
          {
            value: "RPFHKMATR",
            label: "台湾居民来往大陆通行证",
          },
          {
            value: "PRICFF",
            label: "外国人永久居留身份证",
          },
          {
            value: "HKAMP",
            label: "港澳通行证",
          },
          {
            value: "ACCOUNT_BOOK",
            label: "户口本",
          },
          {
            value: "BIRTH_CERTIFICATE",
            label: "出生证明",
          },
          {
            value: "TAIWAN_PASS",
            label: "台湾通行证",
          },
        ],
        value: "",
        //
        tableData: [],
        centerDialogVisible: false,
        multipleSelection: [],
        // 添加内层弹窗
        outerVisible: false,
        innerVisible: false,
        //内层按钮
        reverse: true,
        innerVisibleaAdd: false,
        labelPosition: "right",
        //编辑乘客
        editPassengersList: {
          name: "",
          type: "",
          idNumber: "",
          phone: "",
          reverse: "",
        },
        // 编辑内层弹窗
        innerVisibleaEdit: false,
        assistArr: [],
        additionalPrices: [],
        money: [],
        moneyList: "",
        childdialogVisible: false //儿童说明
      }
    },
    methods: {
      editPassengersListType(){
        this.$forceUpdate();
      },
      // 国家
      selectFnCountry(data,parkey,key){
        this.userLis[parkey][key] = data;
      },
      // 新增常旅客验证码确定按钮
      jumpaaa() {
        if (this.yanzhegnma == '') {
          this.$message({
            message: '请发送验证码 并填写',
            type: 'warning'
          });
        } else {
          this.showLoading()
          this.$axios
            .getphoneMessageValidate({
              //  账号
              userName: this.trainAccount,
              // 密码
              passWord: this.pass,
              // 验证码
              randCode: this.randCode,
              // 验证类型
              validateType: 2,
              // 会员id
              userId: this.membersList.customerId
            })
            .then((res) => {
              this.closeLoading()
              console.log(res);
              this.resData = res.data
              console.log(this.resData)
              if (this.resData.code == 100) {
                this.$message({
                  message: '验证登录成功',
                  type: 'success'
                });
                this.xinzengyanzhegnma = false
                this.showLoading()
                // this.getpassengerList()
              }
              if (this.resData == "102") {
                this.$confirm('参数校验未通过', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
              if (this.resData == "999") {
                this.$confirm('验证码错误', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
              if (this.resData == "320") {
                this.$confirm('该账户需要人脸核验', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
            });
        }
      },
      // 删除已有乘车人
      btnDelate(item){
        this.$axios.deleteById({
          id:item.id
        }).then((res)=>{
          if(res.code == "00000"){
            this.$message({
              message: '删除成功',
              type: 'success'
            });
            this.getpassengerList()
          }else{
            this.$message({
              message: '删除失败',
              type: 'warn'
            });
          }
        })
      },
      // 删除已选乘车乘客
      delpassenger(index){
        console.log(index)
        this.passenger.splice(index,1)
        if(this.feelChirenLength >= this.passenger.length){
            let lastFreeIndex = 0;
            this.passenger.forEach((item,index)=>{
                if(item.isFreeChildren === 'yes') lastFreeIndex=index;
            })
            this.passenger.splice(lastFreeIndex, 1);
            this.feelChirenLength -= 1;
        }
        if(this.feelChirenLength<0) this.feelChirenLength = 0;
        this.priceList()
      },
      // 12306短信验证
      getphoneMessageValidate() {
        this.showLoading()
        
        this.$axios
          .getphoneMessageValidate({
            //  账号
            userName: this.trainAccount,
            // 密码
            passWord: this.pass,
            // 验证码
            randCode: this.randCode,
            // 验证类型
            validateType: 2,
            // 会员id
            customerId: this.membersList.customerId
          })
          .then((res) => {
            this.closeLoading()
            console.log(res);
            this.resData = res.data
            console.log(this.resData)
            if (this.resData.code == 100) {
              this.$message({
                message: '验证登录成功',
                type: 'success'
              });
              this.verification = false
              this.centerDialog = false
              this.centerDialogVisible = true
              this.showLoading()
              this.getpassengerList()
            }
            if (this.resData == "102") {
              this.$confirm('参数校验未通过', '提示', {
                confirmButtonText: '确定',
                type: 'warning'
              })
            }
            if (this.resData == "999") {
              this.$confirm('验证码错误', '提示', {
                confirmButtonText: '确定',
                type: 'warning'
              })
            }
            if (this.resData == "320") {
              this.$confirm('该账户需要人脸核验', '提示', {
                confirmButtonText: '确定',
                type: 'warning'
              })
            }
          });
      },
      //编辑常旅客
      editaddUpdatePassenger(type) {
        if (
          this.editPassengersList.name != "" &&
          this.editPassengersList.type != "" &&
          this.editPassengersList.idNumber != "" &&
          this.editPassengersList.phone != ""
        ) {
          //  debugger
        let contacts = {
          name: this.editPassengersList.name,
          sex: this.editPassengersList.sex,
          identyType: this.editPassengersList.type,
          identy: this.editPassengersList.idNumber,
          personType: this.editPassengersList.reverse,
          phone: this.editPassengersList.phone,
          birthday:this.editPassengersList.birthday,
          passengerId:this.editPassengersList.passengerId,
          id:this.editPassengersList.passengerId,
        }
        if(this.editPassengersList.country)contacts["country"] = this.editPassengersList.country
        if(this.editPassengersList.gatValidDateEnd)contacts["gatValidDateEnd"] = this.editPassengersList.gatValidDateEnd;
        this.$axios.getaddUpdatePassenger({
          trainAccount: this.trainAccount,
          pass: this.pass,
          contacts,
          userId: this.membersList.id,
        }).then((res) => {
          if (res.data.success == true) {
            if(type || res.data.data[0].phone_verify_status == '1'){
              this.$message({
              message: '修改成功',
              type: 'success'
            });
            }
            if(res.data.data[0].phone_verify_status == '0'){
              this.$alert('该乘车人手机号需向12306发送 “'+res.data.data[0].captcha+'” 来通过核验', {
                confirmButtonText: '确定',
                callback: action => {
                  if(action == "confirm"){
                    this.editaddUpdatePassenger('edit');
                  }
                }
              });
            }
           
            this.innerVisibleaEdit = false
            this.getpassengerList()
          } else {
            this.$message({
              message: res.data.errorMsg,
              type: 'warning'
            });
            if (res.data.returnCode == 239001) {
              this.yanzhegnma = ''
              this.xinzengyanzhegnma = true
            }
          }});
        } else {
          this.$message.error('请输入正确的乘车人信息');
        }
      },
      // 新增成旅客
      getaddUpdatePassenger(id=0) {
        console.log(this.formLabelAlign)
        let contacts = {
          id,
          name: this.formLabelAlign.name,
          sex: this.formLabelAlign.sex,
          identyType: this.value,
          identy: this.formLabelAlign.idNumber,
          personType: String(this.reverse1),
          phone: this.formLabelAlign.phone,
          birthday:this.formLabelAlign.birthday
        }
        if(id) contacts['passengerId']=id;
        if(this.formLabelAlign.country)contacts["country"] = this.formLabelAlign.country
        if(this.formLabelAlign.gatValidDateEnd)contacts["gatValidDateEnd"] = this.formLabelAlign.gatValidDateEnd;
        this.showLoading();
        this.$axios.getaddUpdatePassenger({
            trainAccount: this.trainAccount,
            pass: this.pass,
            contacts,
            userId: this.membersList.id,
        }).then((res) => {
            // console.log(res.data)
            this.closeLoading();
            if (res.data.success == true) {
              if (res.data.data.length > 0) {
                this.dataList = res.data.data;
              }
              if(res.data.data[0].phone_verify_status == '0'){
                this.$alert('该乘车人手机号需向12306发送 “'+res.data.data[0].captcha+'” 来通过核验', {
                  confirmButtonText: '确定',
                  callback: action => {
                    if(action == "confirm"){
                      this.getaddUpdatePassenger(res.data.data[0].passengerId);
                    }
                  }
                });
              }
              this.$message({
                message: '新增乘车人成功',
                type: 'success'
              });
              this.getpassengerList()
              this.innerVisible = false
              // if (res.success == true) {
              //   this.innerVisible = false

              // }
            } else {
              console.log(res.data.errorMsg)
              this.$message({
                message: (res.data.errorMsg),
                type: 'warning'
              });
              if (res.data.returnCode == 239001) {
                this.yanzhegnma = ''
                this.xinzengyanzhegnma = true
              }
            }
          }).catch(err => {
            console.log(err)
          })
      },
      // 筛选未通过核验人员
      passengerListAble(row, index){
        if(row.phoneVerifyStatus == '1' && row.verifyStatus == '1'){
          return true
        } else {
          return false
        }
      },
      // 选中的附加产品
      handleSelectionChangefuying(passengerList) {
        console.log(passengerList, '接收到的passengerList值')
        this.fujiapanpinList = passengerList
        console.log(this.fujiapanpinList)
        this.confirm()
        // console.log(this.passenger)
        // console.log(this.passenger.length)
        // this.information = this.passenger[0]
        // console.log(this.information, '我是添加的数据')
      },
      // 浮盈产品
      getselectassistProduct() {
        localStorage.removeItem("pageSize");
        localStorage.removeItem("pageNum");
        this.$axios.getselectassistProduct({

        }).then((res) => {
          localStorage.setItem("pageSize", 10);
          localStorage.setItem("pageNum", 1);
          console.log(res)
          if (res.code == 200) {
            let arr = res.data;
            let auxiliaryProducts = this.screen(arr);
            this.selectReturnData = auxiliaryProducts;
            console.log(this.selectReturnData)
          }
        })
      },
      // 筛选辅营产品
      screen(arr) {
        let time = this.train.train_date;
        let auxiliaryProducts = [];
        console.log(time); // 类型筛选
        let row = arr.filter((item) => {
          return item.businessType == "train";
        }); // 预定时间筛选
        if (row) {
          let row1 = row.filter((item) => {
            let start = this.datedifference1(item.bookingDateStart, time);
            let end = this.datedifference1(item.bookingDateEnd, time);
            if (start <= 0 && end >= 0) {
              return item;
            } else {}
          });
          return row1;
        }
        console.log(row1);
        return row1;
      },
      //两个时间相差天数 兼容firefox chrome
      datedifference1(sDate1, sDate2) {
        //sDate1和sDate2是2006-12-18格式
        var dateSpan, tempDate, iDays;
        sDate1 = Date.parse(sDate1);
        sDate2 = Date.parse(sDate2);
        dateSpan = sDate1 - sDate2; // dateSpan = Math.abs(dateSpan);
        iDays = Math.floor(dateSpan / (24 * 3600 * 1000));
        return iDays;
      },
      // 注册按钮
      innerVisible1zhuce() {
        this.zhuceList.userName = "",
          this.zhuceList.passWord = "",
          this.zhuceList.idTypeCode = "",
          this.zhuceList.name = "",
          this.zhuceList.idNo = "",
          this.zhuceList.passengerType = null,
          this.zhuceList.mobileNo = "",
          this.innerVisible1 = true
      },
      // 添加乘客按钮
      innerVisibleADD() {
        this.innerVisible = true;
        this.formLabelAlign.name = "",
          this.formLabelAlign.idNumber = "",
          this.formLabelAlign.phone = "",
          this.reverse1 = 0
      },
      // // 获取当前id
      btnModify(row) {
        console.log(row);
        this.commonTrvelersId = row.userId
        this.innerVisibleaEdit = true
        this.getpassengerDetails(row)
      },
      editPhoneVerifyStatus(row) {
        this.commonTrvelersId = row.userId
        this.getpassengerDetails(row);
        this.editaddUpdatePassenger();
        
      },
      checkedList(index) {
        this.checked = index
      },
      prompt() {
        this.$confirm('请查询会员信息', '提示', {
          confirmButtonText: '确定',
          type: 'warning'
        })
      },
      prompt_b() {
        this.$confirm('请选择乘车人', '提示', {
          confirmButtonText: '确定',
          type: 'warning'
        })
      },
      prompt_a() {
        this.$confirm('请选择席位', '提示', {
          confirmButtonText: '确定',
          type: 'warning'
        })
      },
      // 乘客类型
      changeradio() {
        console.log(this.reverse1)
      },
      // 添加乘车人
      Addriders() {
        if (this.membersList.id == undefined) {
          this.prompt()
          if (this.unitprice == 0) {
            this.prompt_a()
          }
        } else {
          this.getqueryAccountId()
          this.centerDialog = true
        }
      },
      // 会员查询
      thequeryCustomer() {
        if (this.unitprice == 0) {
          this.prompt_a()
        } else {
          this.getqueryCustomer()
        }
      },
      // 会员信息查询
      getqueryCustomer() {
        console.log(this.members)
        this.$axios
          .getqueryCustomer({
            //  手机号
            phone: this.members.phone,
            // 身份证号
            cardNumber: this.members.idCard
          })
          .then((res) => {
            console.log(res.data);
            if (res.code == "00000" && res.data) {
              this.membersList = res.data
              console.log(this.membersList)
              let arr = []
              if(this.membersList.lstCustomerCard){
                arr = this.membersList.lstCustomerCard.map(item => {
                  return item.cardId
                })// IscardId
                for (let i = 0; i < arr.length; i++) {
                  if (arr.length == 1 && arr[i] == 1) {
                    this.IscardId = true
                  } else {
                    this.IscardId = false
                  }
                }
              }
              console.log(this.IscardId)
            }else{
              this.$confirm('查询失败,当前账号不存在！！', '提示', {
                confirmButtonText: '确定',
                type: 'warning'
              })
            }
          }).catch(err => {
            console.log(err)
            this.$confirm('查询失败，请核对信息重新查询！！', '提示', {
              confirmButtonText: '确定',
              type: 'warning'
            })
          })
      },
      jump() {
        if (this.randCode == '') {
          this.$message({
            message: '请输入验证码',
            type: 'warning'
          });
        } else {
          this.getphoneMessageValidate()
        }

      },
      // 获取12306
      getqueryAccountId() {
        this.$axios
          .getqueryAccountId({
            // 会员id
            customerId: this.membersList.customerId
            // customerId:77

          })
          .then((res) => {
            console.log(res.data)
            this.pass = res.data.accountPassword
            this.trainAccount = res.data.accountId
          });
      },

      //12306注册接口
      getregisterAccount() {
        if (this.zhuceList.userName == '') {
          this.$message({
            message: '请输入用户名',
            type: 'warning'
          });
        } else if (this.zhuceList.passWord == '') {
          this.$message({
            message: '请输入密码',
            type: 'warning'
          });
        } else if (this.zhuceList.idTypeCode == '') {
          this.$message({
            message: '请选择证件类型',
            type: 'warning'
          });
        } else if (this.zhuceList.name == '') {
          this.$message({
            message: '请输入姓名',
            type: 'warning'
          });
        } else if (this.zhuceList.idNo == '') {
          this.$message({
            message: '请输入证件号码',
            type: 'warning'
          });
        } else if (this.zhuceList.passengerType == null) {
          this.$message({
            message: '请选择旅客类型',
            type: 'warning'
          });
        } else if (this.zhuceList.mobileNo == '') {
          this.$message({
            message: '请输入手机号码',
            type: 'warning'
          });
        } else {
          this.$axios
            .getregisterAccount(this.zhuceList)
            .then((res) => {
              console.log(res);
              if (res.data.success == true) {
                this.dataList = res.data
                console.log(this.dataList)
                this.$message({
                  message: '12306账号注册成功',
                  type: 'success'
                });
                this.innerVisible1 = false
              } else {
                this.$message({
                  message: res.data.msg,
                  type: 'warning'
                });
              }
            });
        }

      },
      // 返回的提示
      open1() {
        this.$message({
          message: this.dataList.msg,
          type: 'warning'
        });
      },
      prompt_x() {
        this.$confirm('请先同意购票服务协议', '提示', {
          confirmButtonText: '确定',
          type: 'warning'
        })
      },
      //  12306登录按钮
      getrelationV() {
        if (this.checked == true) {
          this.getrelationValidate()
        } else {
          this.prompt_x()
        }
      },
      //12306登录接口
      getrelationValidate() {
        this.showLoading()
        
        this.$axios
          .getrelationValidate({
            trainAccount: this.trainAccount,
            pass: this.pass,
            userId: this.membersList.id
          })
          .then((res) => {
            this.closeLoading()
            if (res.code == "00000") {
              //  thia.centerDialogVisible = false;
              this.loginList = res.data
              this.isPass = this.loginList.data
              if (this.loginList.returnCode == 239001) {
                this.$confirm('请用当前手机号发短信666到12306', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
                this.verification = true
              }
              if (this.loginList.returnCode == 221002) {
                this.$confirm('用户名或密码错误', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }

              if (this.loginList.returnCode == 231099) {
                this.$confirm('用户12306账号登录失败', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
              if (this.loginList.returnCode == 239002) {
                this.$confirm('该账号需要人脸核验', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
              if (this.loginList.returnCode == 221005) {
                this.$confirm('登录名不存在', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
              if (this.loginList.returnCode == 221004) {
                this.$confirm('您的用户已经被锁定,锁定时间为20 分钟,请稍后再试', '提示', {
                  confirmButtonText: '确定',
                  type: 'warning'
                })
              }
              if (this.loginList.returnCode == 231000) {
                this.centerDialog = false
                this.centerDialogVisible = true
                this.getpassengerList()
                // this.showLoading()

              }
            }
          });
      },
      //
      goRefundAudit() {},
      //登录返回的数据
      open2() {
        this.$message({
          message: this.loginList.errorMsg,
          type: 'warning'
        })
      },
      confirm() {
        if (this.fujiapanpinList.length >= 1) {
          let arr = 0
          for (let i = 0; i < this.fujiapanpinList.length; i++) {
            arr += this.fujiapanpinList[i].salePrice
          }
          this.underlinePricearr = arr
        }
        var sixChilren = []; //免费儿童
        // 价格计算
        if(this.passenger.length){
          this.contactUser.contactName = this.passenger[0].passName
          this.contactUser.contactPhone = this.passenger[0].passPhone
          if(this.isFeelTrain){
            // 免费儿童
            // 免费儿童开始
              // 1.准备工作
              // 先拿到所有成人人数及所有未满6周岁儿童数组,若数组长度大于成人人数并使其相等
              // 开始
            let adultArr = [];
            let penLinshiArr = this.passenger;
            penLinshiArr.forEach((item)=>{
              if(item.passType === "adult") adultArr.push(item);
              if(item.age*1 < 6) sixChilren.push(item);
            })
            if(sixChilren.length > adultArr.length) sixChilren.length = adultArr.length;
              // 结束
              // 2.确认免费儿童
              // 判断儿童人数是否打开弹框，点击确认请求接口,并确定都有谁
              // 开始
            if(sixChilren.length){
              let sixStr = sixChilren.map( item=> item.passName).join(",");
              this.$confirm('乘客'+sixStr+'未满6周岁，可免费乘车（无座位），如需座位，请购买车票?', '该儿童是否需要座位', {
                confirmButtonText: '购买车票（有座）',
                cancelButtonText: '免费乘车（无座）',
              }).then(() => {
                this.centerDialogVisible = false;
              }).catch(() => {
                sixChilren.forEach((item)=>{
                  this.passenger.forEach((perItem)=>{
                    if(item.certificateNumber === perItem.certificateNumber){
                      this.feelChirenLength+=1;
                      perItem["isFreeChildren"] = 'yes'
                    }else{
                      perItem["isFreeChildren"] = 'no'
                    }
                  })
                  let passenLenth = this.passenger.length - this.feelChirenLength;
                  this.totalprice = (this.unitprice * passenLenth) + 
                  (5 * passenLenth) + (this.underlinePricearr * passenLenth)
                })
                this.centerDialogVisible = false;
              });
            }
              //结束
            // 免费儿童结束
          }
        }
        let passenLenth = this.passenger.length - this.feelChirenLength;
        this.totalprice = (this.unitprice * passenLenth) + 
        (5 * passenLenth) + (this.underlinePricearr * passenLenth)
        if(!sixChilren.length)this.centerDialogVisible = false;
      },
      handleSelectionChange(passengerList) {
        console.log(passengerList, '接收到的passengerList值')
        this.passenger = passengerList;
        console.log(this.passenger)
        console.log(this.passenger.length)
        // this.information = this.passenger[0]
        // console.log(this.information, '我是添加的数据')
      },
      // 计算价格
      priceList() {
        let price1 = 0
        // this.moneyList.forEach(item => {
        //   price1 += item
        // })
        console.log(price1)
        let passenLenth = this.passenger.length - this.feelChirenLength;
        this.totalprice = (this.unitprice * passenLenth) + 
        (5 * passenLenth) + (this.underlinePricearr * passenLenth)
        console.log(this.totalprice)
      },
      // 附营产品
      // selectaccident(item, ind) {
      //   let assistProduct = this.auxiliary
      //   assistProduct[ind].is = !assistProduct[ind].is
      //   let arr = this.auxiliary.filter(item => {
      //     return item.is == true
      //   })
      //   // this.auxiliary = assistProduct
      //   console.log(arr)
      //   this.money = arr.map(item => {
      //     return item.id
      //   })
      //   console.log(this.money)
      //   this.moneyList = arr.map(item => {
      //     return item.salePrice
      //   })
      //   console.log(this.moneyList)
      //   this.priceList()
      // },

      // 添加乘客

      change(index) {
        // debugger
        console.log(this.$route.params.price)


        console.log(this.$route.params.Reclinedtablname)
        if (this.$route.params.Reclinedtablname == 'yz') {
          index = 3
        }
        if (this.$route.params.Reclinedtablname == 'dw') {
          index = 10
        }
        if (this.$route.params.Reclinedtablname == 'edz') {
          index = 2
        }
        if (this.$route.params.Reclinedtablname == 'gjrw') {
          index = 6
        }
        if (this.$route.params.Reclinedtablname == 'rw') {
          index = 5
        }
        if (this.$route.params.Reclinedtablname == 'rz') {
          index = 9
        }
        if (this.$route.params.Reclinedtablname == 'swz') {
          index = 0
        }
        if (this.$route.params.Reclinedtablname == 'tdz') {
          index = 8
        }
        if (this.$route.params.Reclinedtablname == 'wz') {
          index = 7
        }
        if (this.$route.params.Reclinedtablname == 'ydz') {
          index = 1
        }
        if (this.$route.params.Reclinedtablname == 'yw') {
          index = 4
        }
        console.log(index)
        this.number = index;
        this.numberLists = this.number
        
        if (this.numberLists == 1) {
          this.numberLists = 'M'
          this.unitprice = this.seats.ydz_price
        }
        if (this.numberLists == 2) {
          this.numberLists = 'O'
          this.unitprice = this.seats.edz_price
        } 
        if (this.numberLists == 3) {
          this.numberLists = 1

          this.unitprice = this.seats.yz_price
        }
        if (this.numberLists == 4) {
          this.numberLists = 3
          this.unitprice = this.seats.yw_price
        }
        if (this.numberLists == 5) {
          this.numberLists = 4
          // 价格
          this.unitprice = this.seats.rw_price
        }
        if (this.numberLists == 6) {
          this.numberLists = 6
          this.unitprice = this.gjrw_price
        }
        if (this.numberLists == 7) {
          this.numberLists = 0
          this.unitprice = this.seats.wz_price
        }
        if (this.numberLists == 8) {
          this.numberLists = 'P'
          this.unitprice = this.seats.tdz_price
        }
        if (this.numberLists == 9) {
          this.numberLists = '2'
          this.unitprice = this.seats.rz_price
        }
        if (this.numberLists == 10) {
          this.numberLists = 'F'
          this.unitprice = this.seats.dwx_price
        }
        if (this.numberLists == 0) {
          this.numberLists = 9
          this.unitprice = this.seats.swz_price
        }
        console.log(this.numberLists)
        console.log(this.unitprice)
      },
      // 车次详情
      queryTrainSeat() {
        this.$axios
          .getqueryTrainSeat({
            fromStationName: this.train.depart,
            toStationName: this.train.arrive,
            train_code: this.train.train_code,
            train_date: this.train.train_date
          })
          .then((res) => {
            this.closeLoading()
            console.log(res);
            if (res.code == "00000") {
              this.seats = res.data
              this.change()
              if(this.$route.params.zwcode || this.$route.params.zwcode == 0){
                if(this.$route.params.zwcode == 9) this.number = 0;
                if(this.$route.params.zwcode == 'I') this.number = 1;
                if(this.$route.params.zwcode == 'O') this.number = 2;
                if(this.$route.params.zwcode == 1) this.number = 3;
                if(this.$route.params.zwcode == 3) this.number = 4;
                if(this.$route.params.zwcode == 4) this.number = 5;
                if(this.$route.params.zwcode == 6) this.number = 6;
                if(this.$route.params.zwcode == 0) this.number = 7;
                if(this.$route.params.zwcode == 'p') this.number = 8;
                if(this.$route.params.zwcode == 2) this.number = 9;
                if(this.$route.params.zwcode == 'F') this.number = 10;
                this.numberLists = this.$route.params.zwcode;
              } 
              this.unitprice = this.$route.params.price;
            }
          });
      },
      // 年龄判断
      getperssonAge(value, type) {
        // 非空判断
        if(!value) return false
        console.log(value)
        var myDate = new Date();
        var year = myDate.getFullYear();
        var month = myDate.getMonth() + 1;
        var day = myDate.getDate();
        var returnAge = 0;
        // 若有证件号则用证件号计算年龄
        if(type === 'certificateType'){
          returnAge = year - value.substring(6, 10) - 1;
          if (value.substring(10, 12) < month || value.substring(10, 12) == month && value.substring(12, 14) <= day) {
              returnAge++;
          }
        // 用没有则用生日查
        }else{
          let birthDate = value.split("-");
          var birYear = birthDate[0];
          var birMonth = birthDate[1];
          var birDay = birthDate[2];
          if (year == birYear) {
            returnAge = 0; // 
          } else {
            var ageDiff = year - birYear; // 
            if (ageDiff > 0) {
              if (month == birMonth) {
                var dayDiff = day - birDay; // 
                if (dayDiff < 0) {
                  returnAge = ageDiff - 1;
                } else {
                  returnAge = ageDiff;
                }
              } else {
                var monthDiff = month - birMonth; // 
                if (monthDiff < 0) {
                  returnAge = ageDiff - 1;
                } else {
                  returnAge = ageDiff;
                }
              }
            } 
          }
        }
        return returnAge;
        
      },
      // 当前用户乘车人列表
      getpassengerList() {
        this.$axios
          .getpassengerList({
            userId: this.membersList.id
          })
          .then((res) => {
            this.closeLoading()
            if (res.code == "00000") {
              let personArr = [];
              let arr = JSON.parse(JSON.stringify(res.data))
              arr = arr.map((item)=>item.trainPassengerBOS);
              personArr = arr.reduce(function (a, b) { 
                  return a.concat(b)
              });
              personArr.forEach(item => {
                if(item.certificateType === 'ZGJMSFZ'){
                  item.age = this.getperssonAge(item.certificateNumber,"certificateType")
                }else{
                  item.age = this.getperssonAge(item.birthday,"other")
                }
                item.is = false
              })
              this.passengerList = personArr
              console.log(this.passengerList)
            }
          });
      },
      closeLoading() {
        this.tableLoading.close();
      },
      showLoading() {
        this.tableLoading = this.$loading({
          text: "拼命加载数据中", //显示在加载图标下方的加载文案
          spinner: "el-icon-loading", //自定义加载图标类名
          background: "rgba(0, 0, 0, 0.4)", //遮罩层颜色
          target: document.querySelector("#table"), //loadin覆盖的dom元素节点
        });
      },
      create() {
        console.log(this.type)
        if (this.type == 'change') {
          // this.$router.push({name:'identifica'})
          this.gettrainRequestChange()
        } else {
          if (this.totalprice == 0) {
            this.prompt_b()
          } else {
            this.traincreateOrder()
          }

        }
      },
      Train12306AccountAgreement() {
        this.AccountAgreement = true
        // this.$router.push({
        //   name: "Train12306AccountAgreement"
        // })
      },
      // 创建订单
      traincreateOrder() {
        // debugger;
        let passengers = []
        if(this.passenger.length){
          this.showLoading()
          this.passenger.forEach((item)=>{
            passengers.push({
              passengersename:item.passName,
              passportseno:item.certificateNumber,
              passporttypeseid:item.certificateType,
              zwcode:this.numberLists,
              price:this.unitprice,
              piaotype:item.passType,
              phoneNum:item.passPhone,
              isFreeChildren:item.isFreeChildren,
            })
          })
        
        /* 前附件产品
        // person 为人员列表
        for (let j = 0; j < this.fujiapanpinList.length; j++) {
            var assData = this.fujiapanpinList[j];
            var obj = {};
            obj.idNo = person.certificateNumcer;
            obj.productId = assData.id;
            arr.push(obj);
            console.log(arr)
            this.money = arr
          } 
        */
        this.$axios.gettraincreateOrder({
            // 优惠卷
            // products: this.money,
            // 用户ID
            userId: this.membersList.id,
            // 出发站
            from_station_name: this.seats.from_station_name,
            // 到达站点
            to_station_name: this.seats.to_station_name,
            // 车次
            checi: this.seats.train_code,
            // 发车日期
            train_date: this.seats.strTime,
            // 出发时间
            start_time: this.seats.start_time,
            // 到达时间
            arrive_time: this.seats.arrive_time,
            // 是否当天到达
            addDay: this.seats.arrive_days*1,
            // 坐席类型
            zwcode: this.numberLists,
            // 坐席名称
            // zwname: this.numberLists,
            // 支付价格
            payamount: this.totalprice,
            // 票总价
            sumamount: this.unitprice*(passengers.length - this.feelChirenLength),
            // 联系人
            contactName:this.contactUser.contactName,
            // 短信通知
            SMSnotification: this.contactUser.contactPhone,
            // 乘车人
            passengers,
            // 渠道
            orderSource: 'crm',
          }).then((res) => {
            this.closeLoading()
            if (res.code == "00000") {
              this.codeList = res.data
            }
            // if (res.success == false) {
            // }
            if (this.codeList.success == "true") {
              localStorage.setItem("train",this.codeList.orderId);
              localStorage.setItem("customerId",this.membersList.id);
              this.$router.push({
                name: "identifica",
                params: {
                  train: this.codeList.orderId,
                  customerId: this.membersList.id
                }
              });
            }
            if (this.codeList.success == "false") {
              this.$message.error(res.data.msg);
            }

          }).catch((err) => {
            this.closeLoading()
          })
        }else{
          this.prompt_b();
        }
      },
      // 确认改签订单
      gettrainRequestChange() {
        this.showLoading()
        this.$axios.gettrainRequestChange({
          orderSource: 'crm',
          orderid: String(this.$route.params.mes.trainOrderId),
          ticketinfo: this.$route.params.mes.orderItemId,
          addDay: this.seats.arrive_days*1,
          from_station_name: this.$route.params.mes.depart,
          to_station_name: this.$route.params.mes.arrive,
          change_checi: this.$route.params.train.train_code,
          change_zwcode: this.numberLists,
          change_datetime: this.train.train_date + ' ' + this.seats.start_time + ':00'
        }).then(res => {
          this.closeLoading()
          setTimeout(() => {
            if (res.code == '00000') {
              console.log(res)
              if (res.data.success == false) {
                this.$message.error(res.data.msg);
              }
              if (res.data.success == true) {
                localStorage.setItem("orderId", res.data.orderId);
                localStorage.setItem("merchantOrderId", res.data.merchantOrderId);
                this.$router.push({
                  name: "endorsedtopay",
                  params: {
                    train: res.data.orderId,
                    orderId: res.data.orderId,
                    merchantOrderId: res.data.merchantOrderId,
                    customerId: this.$route.params.mes.customerId,
                    type: 'change',
                  }
                });
              }
            }
          }, 2000);

        }).catch((err) => {
          this.closeLoading()
        })
      },
      // 添加常旅客
      addsubmitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {

            if (this.value == '') {
              this.$message({
                message: '请选择证件类型',
                type: 'warning'
              });
              return false;
            }
            this.getaddUpdatePassenger()
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      // 添加常旅客取消按钮
      canceladddata() {
        this.canceladddata = false,
          this.formLabelAlign.name = "",
          this.formLabelAlign.idNumber = "",
          this.formLabelAlign.phone = "",
          this.value = ""
      },

      // 查寻待修改的乘车人信息
      getpassengerDetails(editUserItem) {
        this.editPassengersList = editUserItem;
        this.editPassengersList.passengerId = editUserItem.id;
        this.editPassengersList.idNumber = editUserItem.certificateNumber;
        this.editPassengersList.type = editUserItem.certificateType;
        this.editPassengersList.sex =  editUserItem.passSex === "female" ? 0:1;
        this.editPassengersList.reverse = editUserItem.passType== "adult"? 0 : 1
        this.editPassengersList.phone = editUserItem.passPhone
        this.editPassengersList.name = editUserItem.passName
        this.editPassengersList.country = editUserItem.country
        this.editPassengersList.gatValidDateEnd = editUserItem.certificateDate
      },
      // 儿童说明弹窗打开
      childexplainmethod() {
        this.childdialogVisible = true
      }
    },
    mounted() {
      
      // console.log(this.$route.params.price)
      // if(this.$route.params.price){
      //   this.change()
      // }
      //       this.unitprice=this.$route.params.price
      //     console.log(this.unitprice)
      this.go = this.$route.params.go
      console.log(this.go)
      if (this.go) {
        this.$axios.getcustomerByTrainNum({
          orderNum: String(this.go)
        }).then((res) => {
          console.log(res)
          this.members.phone = res.data.userAccount,
          this.membersList.idCard = res.data.idCard,
          this.membersList.customerName = res.data.userName
        })
      }
      this.type = this.$route.params.type
      this.train = this.$route.params.train
      // this.mes = 
      // console.log(this.train, this.$route.params.type, this.type)
      // 附加产品  
      //  this.Reclinedtablname=
      this.queryTrainSeat()
      console.log(this.$route.params.Reclinedtablname)
      if(this.$route.params.mes){
        this.formerPrice = this.$route.params.mes.ticketPrice
      }
      // if(this.$route.params.Reclinedtablname &&  this.seats){
      //   this.change()
      // }
      // this.assistProductList()
      // 车次详情
      this.showLoading()
      // 浮盈产品
      // this.getselectassistProduct()

    },
  }
</script>

<style scoped>
  .trainReserve {
    padding: 20px;
  }

  .top {
    display: flex;
  }

  .left {
    width: 75%;
    margin-right: 20px;
  }

  .left_1 {
    display: flex;
    background-color: #edf8ff;
  }

  .right {
    width: 20%;
  }

  .right_3 {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    margin-top: 10px;
  }

  .right_4 {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
  }

  .right_5 {
    margin-top: 20px;
    background-color: #f8fbfe;
    width: 100%;
    height: 320px;
  }

  .button_1 {
    margin: auto;
  }

  .addBtn {
    float: right;
    color: #fff;
    background-color: #26a69a;
  }

  .confirmAdd {
    margin-top: 100px;
    margin-left: 30%;
    width: 30%;
    color: #fff;
    background-color: #26a69a;
  }

  .radios {
    margin-left: 30px;
    margin-bottom: 30px;
  }

  .btnRefer {
    margin-top: 100px;
    width: 100%;
    color: #fff;
    background-color: #26a69a;
  }

  .cancelbtnRefer {
    margin-top: 30px;
    width: 100%;
    color: black;
  }

  .a-register {
    cursor: pointer;
    color: #24b6ef;
    background-color: #fff;
    border: none;
  }

  .input1 {
    margin: 30px 0;
    display: flex;
    height: 40px;
    line-height: 40px;
  }

  .input {
    width: 400px;
  }

  .btn-div {
    width: 100%;
    text-align: center;
  }

  .read {
    text-align: center;
    margin-bottom: 30px;
  }

  .read>a {
    margin: 0 10px;
    text-decoration: none;
    color: #01aaed;
  }

  .childexplain {
    color: #18AEFF;
    cursor: pointer;
  }
</style>